/*页面变量*/
$icon_color1:#0067a6;
$icon_color2:#efc028;
$icon_color3:#008972;
$icon_color4:#00abd8;
$icon_color5:#f2572d;
$icon_color6:#bead92;
$icon_color7:#f35a4a;
$icon_color8:#a2ef54;
$icon_color9:#f26378;
/*字体*/
body,textarea,input,button,select,keygen,legend{font:12px/1.14 'Microsoft YaHei',arial,\5b8b\4f53;color:#333;outline:0;}
/*项目css*/
.f-hidden{display:none;}
/*头部统计信息*/
.top-info-box{
  padding:30px 0;
  background:#434f5b;
  color:#fff;
  margin-bottom:20px;
  .am-slider-default{
    background:none;
    margin:0;
    .am-control-nav{
      display:none;
    }
  }
  .info-item{
    display:block;
    font-size:1.4rem;
    text-align:center;
    color:#fff;
    position: relative;
    .num{
      display:block;
      padding:8px;
      font-size:3rem;
      overflow: hidden;text-overflow:ellipsis;white-space: nowrap;
    }
    &:after{
      content:'';
      display:block;
      width:0;
      height:60px;
      border-right:1px solid #333;
      position:absolute;
      left:0;top:10px;
    }
  }
}
/*九宫格*/
.lattice-9{
  position:relative;
  padding:0;
  margin: 0;
  height:auto;
  background:#fff;
  &:after{
    display:block;content:'';height:0;overflow:hidden;clear:both;
  }
  .item{
    display:block;
    width:33.333333%;
    height:33vw;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    border:1px solid #e8e8e8;
    border-width:0 1px 1px 0;
    float:left;
    padding:6vw;
    text-align:center;
    position:relative;
    overflow: hidden;
    .iconfont{
      font-size:32px;
      line-height:12vw;
    }
    .text{
      font-size:14px;
      color:#989898;
      line-height:8vw;
      overflow: hidden;text-overflow:ellipsis;white-space: nowrap;
    }
    .corner{
      position:absolute;
      right:0;
      top:0;
      .num{
        font-size:13px;
        color:#fff;
        position:relative;
        z-index:1;
        display:block;
        width:25px;
        text-align:center;
      }
      &:after{
        display:block;
        content:'';
        width:60px;
        height:30px;
        background:#ff0000;
        position: absolute;
        top:-10px;
        right:-20px;
        transform:rotate(45deg);
        -ms-transform:rotate(45deg); 	/* IE 9 */
        -moz-transform:rotate(45deg); 	/* Firefox */
        -webkit-transform:rotate(45deg); /* Safari 和 Chrome */
        -o-transform:rotate(45deg); 	/* Opera */
      }
    }
    &:nth-child(3n){border-right:none;}
    &:nth-of-type(1){ .iconfont{  color:$icon_color1 } }
    &:nth-of-type(2){ .iconfont{  color:$icon_color2 } }
    &:nth-of-type(3){ .iconfont{  color:$icon_color3 } }
    &:nth-of-type(4){ .iconfont{  color:$icon_color4 } }
    &:nth-of-type(5){ .iconfont{  color:$icon_color5 } }
    &:nth-of-type(6){ .iconfont{  color:$icon_color6 } }
    &:nth-of-type(7){ .iconfont{  color:$icon_color7 } }
    &:nth-of-type(8){ .iconfont{  color:$icon_color8 } }
    &:nth-of-type(9){ .iconfont{  color:$icon_color9 } }
  }
}
/*表单*/
.app-form{
  background:#fff;
  padding:10px;
  fieldset{
    padding:0;
    display: block;
    width:100%;
  }
  legend{font-size:1.4rem;color:#989898;}
  /*行内排列*/
  .app-form-line{
    width:100%;
    .am-form-group{
      width:100%;
      position:relative;
      padding-left:70px;
      min-height:3rem;
      .action-icon{
        display:block;
        width:3rem;
        height:3rem;
        background:#fff;
        text-align:center;
        position:absolute;
        right:2px;
        top:2px;
        .iconfont{
          font-size:1.8rem;
          line-height:3rem;
        }
      }
    }
    .am-checkbox,.am-radio,.checkbox-box{
      width:100%;
      position:relative;
      padding:0.5rem 0 0.5rem 90px;
    }
    .checkbox-box{
      width:100%;
      position:relative;
      padding:0.5rem 0 0.5rem 70px;
    }
    .checkbox,.radio{
      font-size:1.4rem;
      height:2rem;
      line-height:2rem;
    }
    .tit{
      font-size:1.4rem;
      color:#989898;
      font-weight:500;
      width:60px;
      height:3rem;
      line-height:3rem;
      overflow: hidden;text-overflow:ellipsis;white-space: nowrap;
      text-align:right;
      position:absolute;
      top:0;
      left:0;
    }
    .input-text,.textarea-text,.select{
      width:100%;
      font:1.4rem/2rem ！important;
    }
    /*上传图片*/
    .upload-img-box{
      margin-left:-10px;
      .upload-img-item{
        width:70px;
        height:70px;
        border:1px solid #e8e8e8;
        float:left;
        margin-left:10px;
        margin-bottom:10px;
        background-repeat:no-repeat;background-position:center center;background-size:cover;
      }
      .upload-img{
        display:block;
        width:70px;
        height:70px;
        border:1px solid #e8e8e8;
        position:relative;
        margin-left:10px;
        float:left;
         background-repeat:no-repeat;background-position:center center;background-size:cover;
        &:after{
          display:block;
          content:'';
          width:0;
          height:30px;
          border-right:1px solid #e8e8e8;
          position:absolute;
          left:34px;
          top:20px;
        }
        &:before{
          display:block;
          content:'';
          width:30px;
          height:0;
          border-top:1px solid #e8e8e8;
          position:absolute;
          left:20px;
          top:34px;
        }
      }
      .single-img-upload{
        &:after,&:before{
          display:none;
        }
      }
    }
    /*上传附件*/
    .upload-file-box{
      .file-item{
        position:relative;
        padding:0.5rem;
        font-size:1.4rem;
        line-height:2rem;
        padding-right:40px;
        overflow: hidden;text-overflow:ellipsis;white-space: nowrap;
        .file-icon{
          color:#989898;
          font-size:16px;
          margin-right:5px;
        }
        .del-file{
          display:block;
          height:3rem;
          width:40px;
          position:absolute;
          right:0;
          top:0;
          text-align:center;
          .iconfont{
            font-size:18px;
            line-height:3rem;
          }
        }
      }
    }
  }
}
/*表单样式2*/
.app-form2{
  background:#fff;
  padding:10px;
  fieldset{
    padding:0;
    display: block;
    width:100%;
  }
  legend{font-size:1.4rem;color:#989898;}
  /*行内排列*/
  .app-form-line{
    width:100%;
    .am-form-group{
      width:100%;
      position:relative;
      padding-left:70px;
      min-height:3rem;
      padding-bottom:8px;
      border-bottom:1px solid #e8e8e8;
      .action-icon{
        display:block;
        width:3rem;
        height:3rem;
        background:#fff;
        text-align:center;
        position:absolute;
        right:2px;
        top:2px;
        .iconfont{
          font-size:1.8rem;
          line-height:3rem;
        }
      }
      .action-link{
        display:block;
        width:40px;
        height:2rem;
        background:#f8f8f8;
        position:absolute;
        right:2px;
        top:0.6rem;
        font-size: 1.4rem;
        line-height:2rem;
        text-align:center;
        color:#989898;
      }
    }
    .am-checkbox,.am-radio,.checkbox-box{
      width:100%;
      position:relative;
      padding:0.5rem 0 0.5rem 90px;
      border-bottom:1px solid #e8e8e8;
      padding-bottom:8px;
    }
    .checkbox-box{
      width:100%;
      position:relative;
      padding:0.3rem 0 0.7rem 70px;
    }
    .checkbox,.radio{
      font-size:1.4rem;
      height:2rem;
      line-height:2rem;
    }
    .tit{
      font-size:1.4rem;
      color:#989898;
      font-weight:500;
      width:60px;
      height:3rem;
      line-height:3rem;
      overflow: hidden;text-overflow:ellipsis;white-space: nowrap;
      text-align:right;
      position:absolute;
      top:0;
      left:0;
    }
    .input-text,.textarea-text,.select{
      width:100%;
      font:1.4rem/2rem ！important;
      border:none;
    }
    .select{
      option{
        font-size:1.2rem;
      }
    }
    /*上传图片*/
    .upload-img-box{
      margin-left:-10px;
      .upload-img-item{
        width:70px;
        height:70px;
        border:1px solid #e8e8e8;
        float:left;
        margin-left:10px;
        margin-bottom:10px;
        background-repeat:no-repeat;background-position:center center;background-size:cover;
      }
      .upload-img{
        display:block;
        width:70px;
        height:70px;
        border:1px solid #e8e8e8;
        position:relative;
        margin-left:10px;
        float:left;
        background-repeat:no-repeat;background-position:center center;background-size:cover;
        &:after{
          display:block;
          content:'';
          width:0;
          height:30px;
          border-right:1px solid #e8e8e8;
          position:absolute;
          left:34px;
          top:20px;
        }
        &:before{
          display:block;
          content:'';
          width:30px;
          height:0;
          border-top:1px solid #e8e8e8;
          position:absolute;
          left:20px;
          top:34px;
        }
      }
      .single-img-upload{
        &:after,&:before{
          display:none;
        }
      }
    }
    /*上传附件*/
    .upload-file-box{
      .file-item{
        position:relative;
        padding:0.5rem;
        font-size:1.4rem;
        line-height:2rem;
        padding-right:40px;
        overflow: hidden;text-overflow:ellipsis;white-space: nowrap;
        .file-icon{
          color:#989898;
          font-size:16px;
          margin-right:5px;
        }
        .del-file{
          display:block;
          height:3rem;
          width:40px;
          position:absolute;
          right:0;
          top:0;
          text-align:center;
          .iconfont{
            font-size:18px;
            line-height:3rem;
          }
        }
      }
    }
  }
  .am-btn-xl{
    font-size:1.6rem;
    line-height:2.8rem;
  }
  /*音频模块*/
  .form-sound-box{
    .star-sound{
      display:block;
      margin:0 auto 10px;
      .sound-record{
        display:block;
        width:40px;
        height:40px;
        text-align:center;
        font-size:32px;
        color:#333;
        line-height:40px;
        background:#ddd;
        border-radius:50%;
        float:left;
      }
      .text{
        font-size:14px;
        color:#989898;
        line-height:40px;
        margin-left:15px;
      }
    }
    .recording{
      padding:10px 50px;
      border:1px solid #e8e8e8;
      position:relative;
      height:60px;
      display:none;
      .symbol_icon{
        position:absolute;
        top:10px;
        left:10px;
      }
      .stop{
        display:block;
        width:40px;
        height:40px;
        text-align:center;
        font-size:32px;
        color:#989898;
        line-height:40px;
        position:absolute;
        top:10px;
        right:10px;
      }
      .progress{
        font-size:13px;
        text-align:center;
        .progress-time{
          color:#ff0000;
          margin-bottom:10px;
        }
        .progress-bar{
          height:5px;
          width:100%;
          background:#ff0000;
        }
        .progress-animation{
          animation: progress 60s;
          -moz-animation: progress 60s;	/* Firefox */
          -webkit-animation: progress 60s;	/* Safari 和 Chrome */
          -o-animation: progress 60s;	/* Opera */
          animation-timing-function:linear;
        }
        .pause {
          animation-play-state: paused;
        }
      }
    }
    .play-box{
      padding:10px;
      margin:5px auto;
      border:1px solid #e8e8e8;
      .icon-yinpinbofang{
        display:block;
        width:40px;
        height:40px;
        font-size:32px;
        line-height:40px;
        text-align:center;
        float:left;
      }
      .play{
        color:$icon_color5;
      }
      .stop{
        color:#989898;
      }
      .text{
        font-size:14px;
        color:#989898;
        line-height:40px;
        margin-left:15px;
      }
    }
  }
}
@keyframes progress
{
  from {width:0;}
  to {width:100%;}
}
@-moz-keyframes progress /* Firefox */
{
  from {width:0;}
  to {width:100%;}
}
@-webkit-keyframes progress /* Safari 和 Chrome */
{
  from {width:0;}
  to {width:100%;}
}
@-o-keyframes progress /* Opera */
{
  from {width:0;}
  to {width:100%;}
}
.symbol_icon{
  width:40px; height: 40px;
  line-height:40px;
  fill: currentColor;
  overflow: hidden;
}
/*线索、商机、客户列表*/
.app-list{
  background:#fff;
  ul{
    padding:0;margin:0;
  }
  .list-tab{
    background:#f8f8f8;
    height:40px;
    .item{
      .link{
        display:block;
        width:100%;
        height:40px;
        font-size:14px;
        line-height:40px;
        color:#333;
        text-align: center;
        color:#333;
      }
      .active{
        background:#fff;
        border-bottom:2px solid $icon_color1;
        position:relative;
        &:after{
          position: absolute;
          width: 0;
          height: 0;
          bottom: 0;
          left: 50%;
          margin-left: -5px;
          border: 6px rgba(0,0,0,0) solid;
          content: "";
          z-index: 1;
          border-bottom-color: $icon_color1;
        }
      }
    }

  }
  /*线索列表*/
  .leads-list{
    padding:10px;
    margin:0;
    .item{
      padding:10px 0;
      border-bottom:1px dashed #e8e8e8;
      position:relative;
      min-height:117px;
      .link{
        display:block;
        width:100%;
        height:100%;
        position:absolute;
        top: 0;
        left: 0;
      }
      .thumb{
        width:60px;
        height:60px;
        position:absolute;
        top:25px;
        left:0;
        overflow: hidden;
        .surname{
          display:block;
          width:60px;
          height:60px;
          border-radius:50%;
          background:#efefef;
          color:#333;
          font-size:24px;
          text-align:center;
          line-height:60px;
        }
      }
      .info-box{
        padding-left:70px;
        padding-right:40px;
        .name{
          font-size:16px;
          margin:0;
          padding:0;
          line-height: 24px;
          color:#333;
          font-weight:500;
          .sex{
            font-size:12px;
            color:#989898;
            margin-left:10px;
          }
        }
        .mobile{
          font-size:14px;
          line-height:24px;
          color:#989898;
          margin:0;
          padding:0;
        }
        .info{
          font-size:12px;
          line-height:24px;
          color:#989898;
          margin:0;
          padding:0;
        }
      }
      .action-box{
        width:40px;
        position:absolute;
        right: 0;
        top:10px;
        .action-link{
          display:block;
          width:40px;
          height:40px;
          border-radius:50%;
          line-height:40px;
          text-align:center;
          margin-bottom:10px;
          background:#ddd;
          color:#333;
          .iconfont{
            font-size:24px;
          }
        }
      }
    }
  }
}
/*线索详情*/
.leads-info-box{
  position:relative;
  padding:10px;
  background:#fff;
  margin-bottom:15px;
  .info-box{
    position:relative;
    padding-left:90px;
    min-height:80px;
    margin-bottom:10px;
    .thumb{
      width:80px;
      height:80px;
      position:absolute;
      top: 0;
      left: 0;
      img{
        width:80px;
        height:80px;
      }
    }
    .name{
      font-size:16px;
      margin:0;
      padding:0;
      line-height: 24px;
      color:#333;
      font-weight:500;
      .sex{
        font-size:12px;
        color:#989898;
        margin-left:10px;
      }
    }
    .mobile{
      font-size:14px;
      line-height:24px;
      color:#989898;
      margin:0;
      padding:0;
    }
    .info{
      font-size:12px;
      line-height:24px;
      color:#989898;
      margin:0;
      padding:0;
    }
  }
  .action-box{
    padding:10px;
    border:1px solid #e8e8e8;
    .action-link{
      display:block;
      width:100%;
      height:40px;
      line-height:40px;
      text-align:center;
      font-size:14px;
    }
  }
}
/*时间轴*/
.timeline{
  padding:10px;
  margin:0 auto;
  background:#fff;
  .item{
    position:relative;
    min-height:60px;
    padding-left:85px;
    .time-box{
      width:80px;
      height:60px;
      position:absolute;
      left: 0;
      top:0;
      .date{
        font-size:12px;
        line-height:30px;
      }
      .time{
        font-size:18px;
        line-height:30px;
        color:$icon_color1;
      }
      .node{
        display:block;
        width:20px;
        height:20px;
        border-radius:50%;
        position:absolute;
        background:$icon_color1;
        border:3px solid #afdcf8;
        right:-16px;
        top:0;
        z-index:1;
      }
    }
    .item-main{
      height:auto;
      padding:0 0 20px 20px;
      border-left:3px solid #afdcf8;
      position:relative;
      &:after{
        position: absolute;
        width: 0;
        height: 0;
        bottom: 0;
        left:8px;
        top:10px;
        border: 6px rgba(0,0,0,0) solid;
        content: "";
        z-index: 1;
        border-right-color: #f2f2f2;
      }
      .info-box{
        padding:0 10px;
        background:#f2f2f2;
        color:#333;
        .info-title{
          font-size:14px;line-height:30px;color:#333;font-weight:500;
          padding:0;margin:0;
          .sub{
            font-size:12px;color:#989898;margin-left:10px;
          }
        }
        .info{
          padding:5px 0;font-size:13px;line-height:24px;color:#333;margin:0;
        }
        .action-box{
          padding:5px;font-size:12px;line-height:24px;
          border-top:1px solid #e8e8e8;
          &:after{
            display:block;content:'';height:0;overflow:hidden;clear:both;
          }
          .comment{
            float:right;color:$icon_color1;
          }
       }
        .comment-item{
          .comment-title{
            font-size:12px;line-height:30px;color:#333;font-weight:500;
            border-bottom:1px solid #e8e8e8;margin:0;
          }
          .comment-info{
            padding:5px 0;margin:0;font-size:12px;color:#989898;line-height:24px;
          }
        }
      }
    }
  }
}

/*复写底部菜单*/
.am-navbar-default {
  a{
    color:#989898;
    .iconfont{
      font-size:24px;
      line-height:30px;
    }
  }
  .active{
    color:$icon_color5;
  }
  .am-navbar-nav{

    background-color: #f8f8f8;
    border-top:1px solid #e8e8e8;
  }
}
.am-slider-default{
  -webkit-box-shadow:none;
  -moz-box-shadow: none;
  box-shadow: none;
}
/*空信息提示*/
.no-msg{
  text-align:center;
  padding:30px 0;
  color:#989898;
  .iconfont{
    font-size:32px;
  }
  .text{
    font-size:1.4rem;
    line-height:3rem;
  }
}
/*背景*/
.bg-color1{background:$icon_color1 !important;;color:#fff !important;}
.bg-color2{background:$icon_color2 !important;color:#fff !important;}
.bg-color3{background:$icon_color3 !important;color:#fff !important;}
.bg-color4{background:$icon_color4 !important;color:#fff !important;}
.bg-color5{background:$icon_color5 !important;color:#fff !important;}
.bg-color6{background:$icon_color6 !important;color:#fff !important;}
.bg-color7{background:$icon_color7 !important;color:#fff !important;}
.bg-color8{background:$icon_color8 !important;color:#fff !important;}
.bg-color9{background:$icon_color9 !important;color:#fff !important;}
